<template>
  <div>
    <TopFilter ref="formPanel1" :list="topFilterList" :cols="2" labelWidth="100" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <FilterTable
      ref="orderTable"
      selectionType="single"
      :columns="columns"
      height="320px"
      :params="fetchParams"
      :fetchapi="fetchApi"
      :datakey="'rows'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="columns => (this.partChangeColumns = columns)"
    ></FilterTable>
    <div class="confirm-button-style">
      <el-button type="primary" @click="saveDialog">确 定</el-button>
      <el-button @click="closeDialog">取 消</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getBalanceList } from '@/api/finance/repairFinance/cancelFinance';

export default {
  name: 'searchBalance',
  components: {},
  mixins: [dictionary],
  props: ['WorkSearch_rono', 'WorkSearch_partno'],
  data() {
    this.BaseTable = null;
    return {
      topFilterList: this.createTopFilterList(),
      visible: false,
      dialogTitle: '',
      fetchApi: getBalanceList,
      fetchParams: { xhrAbort: true, flag: 'SALES_PART_NO' },
      columns: this.createTableColumns(),
      handleType: '',
      formData: {},
      partChangeColumns: []
    };
  },
  mounted() {
    this.BaseTable = this.$refs.orderTable.$refs.pageTable;
    console.log(this.WorkSearch_rono, '查询的工单号');
    // this.topFilterList.find(x => x.fieldName === 'roNo').initialValue = this.WorkSearch_rono;
    this.topFilterList.find(x => x.fieldName === 'salesPartNo').initialValue = this.WorkSearch_partno;
    let param = {
      roNo: this.WorkSearch_rono,
      salesPartNo: this.WorkSearch_partno
    };
    this.changeHandle(param);
  },
  methods: {
    createTopFilterList() {
      return [
        // {
        //   type: 'INPUT',
        //   label: '工单号',
        //   fieldName: 'roNo',
        //   placeholder: '工单号...'
        // },
        {
          type: 'INPUT',
          label: '备件销售单号',
          fieldName: 'salesPartNo',
          placeholder: '备件销售单号...'
        },
        {
          type: 'INPUT',
          label: '结算单号',
          fieldName: 'balanceNo',
          placeholder: '结算单号...'
        },
        {
          type: 'RANGE_DATE',
          label: '结算时间',
          fieldName: 'balanceBeginTime|balanceEndTime',
          placeholder: '选择日期'
        },
        {
          type: 'INPUT',
          label: '车牌号',
          fieldName: 'license',
          placeholder: '车牌号...'
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          fixed: 'left',
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '结算单号',
          dataIndex: 'BALANCE_NO',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        // {
        //   title: '工单号',
        //   dataIndex: 'RO_NO',
        //   width: 150,
        //   sorter: true,
        //   filter: true,
        //   filterType: 'input'
        // },
        {
          title: '备件销售单号',
          dataIndex: 'SALES_PART_NO',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '车牌号',
          dataIndex: 'LICENSE',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true
        },
        {
          title: '车主',
          dataIndex: 'OWNER_NAME',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip: true
        },
        {
          title: '锁定人',
          dataIndex: 'LOCK_USER',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '结算时间',
          dataIndex: 'BALANCE_TIME',
          sorter: true,
          filter: true,
          filterType: 'input',
          dateFormat: 'yyyy-MM-dd'
        }
      ];
    },
    // 搜索回调
    changeHandle(data) {
      console.log(data, 'data');
      this.fetchParams.xhrAbort = true;
      // 根据搜索条件调用列表
      this.fetchParams = Object.assign(this.fetchParams, data, { xhrAbort: false });
    },
    // 点击展开收起重新计算table高度
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    saveDialog() {
      if (!this.partChangeColumns.length) {
        return this.$notify.warning({ title: '提示信息', message: '请选择一条记录！' });
      }
      this.$emit('selectRow', this.partChangeColumns[0]);
      // this.$refs.formPanel1.RESET_FORM();
      this.$emit('close', false);
    },
    closeDialog() {
      // this.$refs.formPanel1.RESET_FORM();
      this.$emit('close', false);
    }
  }
};
</script>

<style scoped>
.confirm-button-style {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 9;
  border-top: 1px solid #e9e9e9;
  padding: 10px 20px;
  background: #fff;
  text-align: center;
}
</style>
